/**
* 生产字体大小class 如“f12”对于font-size:12px;
*/
@fontSizeList: range(6, 100);
@fontSizeLen: length(@fontSizeList);

.font-size(@index) when (@index <=@fontSizeLen) {
  @name: extract(@fontSizeList, @index);

  .f@{name} {
    font-size: ~'@{name}px';
  }

  .font-size(@index + 1);
}

.font-size(1);

/**
* 生成0-100的高度，h-30表示height:30px
*/
@HeightList: range(1, 100);
@lHeightListLen: length(@HeightList);

.height(@index) when (@index <=@lHeightListLen) {
  @name: extract(@HeightList, @index);

  .h-@{name} {
    height: ~'@{name}px';
  }

  .height(@index + 1);
}

.height(1);

/**
* 生成0-100的行高，line-30表示line-height:30px
*/
@lineHeightList: range(1, 100);
@lineHeightLen: length(@lineHeightList);

.line-height(@index) when (@index <=@lineHeightLen) {
  @name: extract(@lineHeightList, @index);

  .line-@{name} {
    line-height: ~'@{name}px';
  }

  .line-height(@index + 1);
}

.line-height(1);

/**
* 生成padding
*/
@paddingList: range(1, 100);
@paddingLen: length(@paddingList);

.each-pd(@index) when (@index <=@paddingLen) {
  @name: extract(@paddingList, @index);

  .pd@{name} {
    padding: ~'@{name}px';
  }

  .each-pd(@index + 1);
}

.each-pd(1);

.each-pdl(@index) when (@index <=@paddingLen) {
  @name: extract(@paddingList, @index);

  .pdl-@{name} {
    padding-left: ~'@{name}px';
  }

  .each-pdl(@index + 1);
}

.each-pdl(1);

.each-pdr(@index) when (@index <=@paddingLen) {
  @name: extract(@paddingList, @index);

  .pdr-@{name} {
    padding-right: ~'@{name}px';
  }

  .each-pdr(@index + 1);
}

.each-pdr(1);

.each-pdt(@index) when (@index <=@paddingLen) {
  @name: extract(@paddingList, @index);

  .pdt-@{name} {
    padding-top: ~'@{name}px';
  }

  .each-pdt(@index + 1);
}

.each-pdt(1);

.each-pdb(@index) when (@index <=@paddingLen) {
  @name: extract(@paddingList, @index);

  .pdb-@{name} {
    padding-bottom: ~'@{name}px';
  }

  .each-pdb(@index + 1);
}

.each-pdb(1);

/**
* 生成margin
*/
@marginList: range(1, 100);
@marginLen: length(@marginList);

.each-mgl(@index) when (@index <=@marginLen) {
  @name: extract(@marginList, @index);

  .mgl-@{name} {
    margin-left: ~'@{name}px';
  }

  .each-mgl(@index + 1);
}

.each-mgl(1);

.each-mgr(@index) when (@index <=@marginLen) {
  @name: extract(@marginList, @index);

  .mgr-@{name} {
    margin-right: ~'@{name}px';
  }

  .each-mgr(@index + 1);
}

.each-mgr(1);

.each-mgt(@index) when (@index <=@marginLen) {
  @name: extract(@marginList, @index);

  .mgt-@{name} {
    margin-top: ~'@{name}px';
  }

  .each-mgt(@index + 1);
}

.each-mgt(1);

.each-mgb(@index) when (@index <=@marginLen) {
  @name: extract(@marginList, @index);

  .mgb-@{name} {
    margin-bottom: ~'@{name}px';
  }

  .each-mgb(@index + 1);
}

.each-mgb(1);
